<!-- 六、使用 <audio> 和 <video> 元素
        任务：创建一个网页，使用 <audio> 元素嵌入一个音乐文件，并允许用户控制播放、暂停和音量调节。
        任务：使用 <video> 元素嵌入一个视频文件，并添加全屏播放功能。
        
        八、使用 <details> 和 <summary> 元素
        任务：创建一个 FAQ 页面，使用 <details> 和 <summary> 元素来组织问题和答案，使其可以折叠和展开。
        
        九、使用 <datalist> 元素
        任务：创建一个表单，其中包含一个文本输入框，使用 元素提供自动完成建议。
        
        十、使用 <figure> 和 <figcaption> 元素
        任务：创建一个包含图片和标题的页面，使用 <figure> 和 <figcaption> 元素来组织内容。
        
        十一、使用 <picture> 元素
        任务：创建一个图片画廊，使用 <picture> 元素来提供不同分辨率的图片，以便在不同设备上优化显示效果。 -->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Embedded Audio and Video</title>
</head>

<body>

    <h2>音乐</h2>
    <audio controls>
        <source src="./作业html合集/461990a22aee6fb1c196a65013d8d68a.mp3" type="audio/mpeg">

    </audio>

    <h2>视频</h2>
    <video controls>
        <source src="./作业html合集/鬼畜视频.mp4" type="video/mp4">

    </video>

</body>

</html>

<!-- <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>页面</title>
</head>
<body>
    <h1>问题和答案</h1>

    <details>
        <summary>今天星期几？</summary>
        <p>星期日</p>
    </details>

    <details>
        <summary>明天星期几？</summary>
        <p>星期一</p>
    </details>

    <details>
        <summary>后天星期几？</summary>
        <p>有完没完？</p>
    </details>

    <details>
        <summary>你猜？</summary>
        <p>我猜你*#*&……#&@#&￥</p>
    </details>
</body>
</html> -->

<!-- <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文本框</title>
</head>
<body>
    <form action="#">
        <label for="username">用户名：</label>
        <input type="text" id="username" name="username" list="usernames">
        <datalist id="usernames">
            <option value="张三">
            <option value="李四">
            <option value="王五">
            <option value="老六">
        </datalist>
        <input type="submit" value="提交">
    </form>
</body>
</html> -->

<!-- <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <style>
        .f1{
            width: 30%;
            height: auto;
        }
    </style>
</head>
<body>
    <figure>
        <img src="https://c-ssl.duitang.com/uploads/blog/202208/31/20220831141206_05525.jpeg" alt="" class="f1">
        <figcaption>好的，我说完了！</figcaption>
    </figure>
</body>
</html> -->

<!-- <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
</head>

<body>
    <picture>

        <source media="(min-width: 1000px)" srcset="https://c-ssl.duitang.com/uploads/blog/202208/24/20220824013551_d9792.jpeg">

        <source media="(min-width: 800px)" srcset="https://c-ssl.duitang.com/uploads/blog/202208/26/20220826001335_df891.jpg">

        <img src="https://c-ssl.dtstatic.com/uploads/blog/202208/24/20220824013551_e4f26.thumb.400_0.jpeg" alt="Example Image">
    </picture>
</body>

</html> -->